<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
	"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" version="-//W3C//DTD XHTML 1.1//EN" xml:lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<script type="text/javascript" src="../../javascripts/prototype.js"> </script> 
	<script type="text/javascript" src="../../javascripts/effects.js"> </script>
	<script type="text/javascript" src="../../javascripts/window.js"> </script>
	<script type="text/javascript" src="../../javascripts/debug.js"> </script>
	<script type="text/javascript" src="../../javascripts/tooltip.js"> </script>

	<link href="../../themes/default.css" rel="stylesheet" type="text/css" >	 </link>
	<link href="../../themes/alphacube.css" rel="stylesheet" type="text/css" >	 </link>

	<title>Tooltip</title>
	<style>
	   body {
	     background:#ECECEC;
	   }
	  .tooltip, .green {
	    color:#191;
	    text-decoration: underline;
	  }
	  .tooltip_content{
    	font: 14px "Trebuchet MS",Verdana,Arial,sans-serif; 
    	overflow:hidden;
    	margin:0;
    	padding:0;
	  }
	  .tooltip_content h3 {
	    margin:0;
    	padding:0;
  	}
	  .alphacube_content {
    	overflow:hidden;
	  }
	</style>
</head>

<body>
<h1>  Lorem ipsum dolor sit amet</h1>  

<h2>  Consectetur adipiscing elit</h2>
  Eset eiusmod tempor incidunt et <span class="tooltip html_tooltip_content1">html content by css class</span> magna aliquam. Ut enim ad minim veniam, quis nostrud exerc. Irure dolor in reprehend incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse molestaie cillum. Tia non ob ea soluad incommod quae egen ium improb fugiend. Officia deserunt mollit anim id est laborum Et harumd dereud facilis est er expedit distinct. Nam liber te conscient to factor tum poen legum odioque civiuda et tam. Neque pecun modut est neque nonor et imper ned libidig met, consectetur adipiscing elit, sed ut labore et dolore magna aliquam is nostrud exercitation ullam mmodo consequet.

<h2>  Duis aute in voluptate velit esse</h2>
  Cillum dolore eu fugiat nulla pariatur. At vver eos et accusam dignissum qui blandit est <span class="tooltip html_tooltip_content2">html content by css class</span>. Trenz pruca beynocguon doas nog apoply su trenz ucu hugh rasoluguon monugor or trenz ucugwo jag scannar. Wa hava laasad trenzsa gwo producgs su IdfoBraid, yop quiel geg ba solaly rasponsubla rof trenzur sala ent dusgrubuguon. Offoctivo immoriatoly, hawrgasi pwicos asi sirucor. Thas <span id="tooltip1" class="green">content set by addHTML</span> applios tyu thuso itoms ghuso pwicos gosi sirucor in mixent gosi sirucor ic mixent ples cak ontisi sowios uf Zerm hawr rwivos. Unte af phen neige pheings atoot Prexs eis phat eit sakem eit vory gast te Plok peish ba useing phen roxas. Eslo idaffacgad gef trenz beynocguon quiel ba trenz Spraadshaag ent trenz dreek wirc procassidt program. Cak pwico vux bolug incluros all uf cak sirucor hawrgasi itoms alung gith cakiw nog pwicos.

<h2>  Plloaso mako nuto uf cakso dodtos</h2>
  Koop a cupy uf cak vux noaw yerw phuno. Whag  <span class="tooltip ajax_123">ajax content by css class</span>., uf efed, quiel ba mada su otrenzr swipontgwook proudgs hus yag su ba dagarmidad. Plasa maku noga wipont trenzsa schengos ent kaap zux copy wipont trenz kipg naar mixent phona. Cak pwico siructiun ruos nust apoply tyu cak UCU sisulutiun munityuw uw cak UCU-TGU jot scannow. Trens roxas eis ti Plokeing quert loppe eis yop prexs. Piy opher hawers, eit yaggles orn ti sumbloat alohe plok. Su havo loasor cakso tgu pwuructs tyu InfuBwain, ghu gill nug bo suloly sispunsiblo fuw cakiw salo anr ristwibutiun. Hei muk neme eis loppe. Treas em wankeing ont sime ploked <span id="tooltip2" class="green">content set by addAjax</span> rof phen sumbloat syug si phat phey gavet peish ta paat ein pheeir sumbloats. Aslu unaffoctor gef cak siructiun gill bo cak spiarshoot anet cak GurGanglo gur pwucossing pwutwam. Ghat dodtos, ig pany, gill bo maro tyu ucakw suftgasi pwuructs hod yot tyubo rotowminor. Plloaso mako nuto uf <span id="tooltip3" class="green">content set by addURL</span> dodtos anr koop a cupy uf cak vux noaw yerw phuno. Whag schengos, uf efed, quiel ba mada su otrenzr swipontgwook proudgs hus yag su ba dagarmidad. Plasa maku noga wipont trenzsa schengos ent kaap zux copy wipont trenz kipg naar mixent phona. Cak pwico siructiun ruos nust apoply tyu cak UCU sisulutiun munityuw uw cak UCU-TGU jot scannow. Trens roxas eis ti Plokeing quert loppe eis yop prexs. Piy opher hawers, eit yaggles orn ti sumbloat alohe plok. Su havo loasor cakso tgu pwuructs tyu.
  <span id="tooltip4" class="green">wizzard
    <a class="hover" href="#onClickURL"><img src="../_img/user-thumb.png" alt="toto" height="12" width="12" style="border:0px;" />wizzard</a>
  </span>
  
<div id="tooltip_content1" style="display:none">
  <div class="tooltip_content">
  <h3>HTML Tooltip</h3>
Cillum dolore eu fugiat nulla pariatur. At vver eos et accusam dignissum qui blandit est praesent. Trenz pruca beynocguon doas nog apoply su trenz ucu hugh rasoluguon monugor or trenz ucugwo jag scannar. Wa hava laasad trenzsa gwo producgs su IdfoBraid, yop quiel geg ba solaly rasponsubla rof trenzur sala ent dusgrubuguon.
  </div>
</div>
<div id="tooltip_content2" style="display:none">
  <div class="tooltip_content">
  <h3>HTML Tooltip</h3>
Cillum dolore eu fugiat nulla pariatur. At vver eos et accusam dignissum qui blandit est praesent. 
  </div>
</div>

<script>
  TooltipManager.init("tooltip", {url: "tooltip_ajax.html", options: {method: 'get'}}, {showEffect: Element.show, hideEffect: Element.hide});
  
  TooltipManager.addHTML("tooltip1", "tooltip_content2");
  TooltipManager.addAjax("tooltip2", {url: "tooltip_ajax.html", options: {method: 'get'}});
  TooltipManager.addURL("tooltip3", "tooltip_url.html", 250, 300);

  TooltipManager.addAjax("tooltip4", {url: "tooltip_ajax.html", options: {method: 'get'}});
</script>
</body>
</html>
